import React, { Component } from 'react';
import style from 'styled-components'

const FootStyle = style.div`
    display:flex;
    justify-content:space-between;
    flex:1
    height:1rem
    .info{
        display:flex;
        flex-direction:column;
        justify-content:space-around;
        width:100%;
        flex:2
        padding:.1rem .1rem .1rem 0 ;
        .total_price{
            .price{
                color:red;
            }
            color:#555;
            font-size:.32rem
            text-align:right;
            width:100%;
        }
        .sale_price{
            color:#888;
            text-align:right;
            width:100%;
            font-size:.16rem;
        }
    }
    .btn{
        flex:1
        line-height:1rem;
        text-align:center;
        background:#f00
        .total_num{
            font-size:.32rem
            color:#fff;
        }
    }
`
class ShopFoot extends Component {
    constructor(){
        super()
        this.state = {

        }
    }
    goPay = () => {
        console.log(1)
    }

    componentDidMount(){
        if(localStorage.getItem('shopcar')){
            const arr = Object.values(localStorage.getItem('shopcar'))
        }
    }

    render() {
        return (
            <FootStyle onClick={()=>{console.log(1)}}>
                <div className="info">
                    <p className="total_price">合计<span className="price">￥{1}</span></p>
                    <p className="sale_price" ><span>总额￥{1}</span><span>立减{1}</span></p>
                </div>
                <div className="btn">
                    <p className="total_num">去结算<span>({2})</span></p>
                </div>
            </FootStyle>
        );
    }
    }

export default ShopFoot;